﻿<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>

    <input type="checkbox">
    <script>
        $(`div`).css(`height`, `100px`);
        $(`div`).css({
            border: "1px solid red",
            borderWidth: "10px",
            "border-color": "blue"
        })
        $(`div`).html(`<h1>内容</h1>`);
         // $("div").text("<h1>内容</h1>");

        // console.log($("div").html());

        // $("div").attr("index","10");
        $("div").each(function (index, item) {
            // console.log(index); //索引值
            // console.log(item); //dom对象
            $(item).attr("index", index); //添加属性
            $(item).attr({  //添加多个属性
                title: "提示信息",
                class: "aaa"
            })
        })
        // 删除某个属性
        $("div").removeAttr("title");

        // 获取属性的值
        var a = $("div").eq(3).attr("index");
        console.log(a);

        // 添加一个class
        $("div").addClass("action");
        // 删除一个class
        $("div").removeClass("action");

        // 是否添加这个属性
        $("input").prop("checked", false);
    </script>
</body>
</html>